{extend name="public/container"}
{block name="content"}
<div class="row">
    <div class="col-sm-12">
        <div class="ibox float-e-margins">
         <div class="ibox-title">
                <h5>搜索</h5>
                <div class="ibox-tools">
                    <a class="collapse-link">
                        <i class="fa fa-chevron-up"></i>
                    </a>
                </div>
                <div class="ibox-content" style="display: block;">
                [FORM]
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-sm-12">
         <div class="ibox">
             <div class="ibox-content">
                 <div class="table-responsive">
                        <table class="layui-hide" id="List" lay-filter="List"></table>
                        <script type="text/html" id="toolbarDemo">
                        <div class="layui-btn-container">
                            <button class="layui-btn" onclick="op_iframe('添加', '{:url('[CONTROLLER]/create')}',1000,600)"><i
                                class="layui-icon layui-icon-add-circle"></i>添加
                            </button>
                          <button class="layui-btn layui-btn-danger" lay-event='delAll'><i
                            class="layui-icon layui-icon-delete"></i>全部删除
                           </button>
                           <button class="layui-btn" lay-event='export'><i
                            class="layui-icon layui-icon-export"></i>导出
                           </button>
                        </div>
                      </script>
                       <script type="text/html" id="barDemo">
                            <a class="layui-btn layui-btn-xs" lay-event="edit"> <i class="fa fa-pencil-square-o"></i> 编辑</a>
                            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete"> <i class="fa fa-trash-o"></i> 删除</a>
                        </script> 
                 </div>
             </div>
         </div>
    </div>
</div>
<script src="{__ADMIN_PATH__}js/layuiList.js"></script>
{/block}
{block name="script"}
 <script>
      layList.form.render();
      var ins = layList.tableList('List',"{:Url('index')}",function () {
            return [LAYUICOL]
                
        })
        //下拉框       
        $(document).click(function (e) {
            $('.layui-nav-child').hide();
        })
        //查询
        layList.search('search', function (where) {
            layList.reload(where, true);
        });
         //监听并执行排序
        layList.sort(['id', 'sort'], true);
        //快速编辑
        layList.edit(function (obj) {
            var id = obj.data.id, value = obj.value;
            action.set_value(obj.field, id, value);
        });
          layList.form.on('switch(status)', function (obj) {
            action.set_value(this.name, this.value, obj.elem.checked ? 1 : 0);
        });
          //头工具栏事件
        layList.table.on('toolbar(List)', function (obj) {
            var checkStatus = layList.table.checkStatus(obj.config.id);
            switch (obj.event) {
                case 'delAll':
                    var data = checkStatus.data;
                    if (data.length > 0) {
                        var ids = [];
                        for (let index = 0; index < data.length; index++) {
                            ids.push(data[index].id)
                        }
                        action.del(ids);
                    } else {
                        layList.msg('没有选择数据!');
                        return;
                    }

                    break;
                case 'getCheckLength':
                    var data = checkStatus.data;
                    layer.msg('选中了：' + data.length + ' 个');
                    break;
                case 'isAll':
                    layer.msg(checkStatus.isAll ? '全选' : '未全选');
                    break;
                case 'export':
                   var laytable = layList;
                    layList.baseGet('[CONTROLLER]/export',{},function(res){
                        laytable.table.exportFile(ins.config.id,res.data,'xls');
                    })
                    break;
            };
        });

         //点击事件绑定
        layList.tool(function (event, data, obj) {
            switch (event) {
                case 'delete':
                    action.del(data.id, obj);
                    break;
                case 'edit':
                    layList.createModalFrame('编辑', '[CONTROLLER]/edit/id/' + data.id, 1200, 700);
                    break;
                case 'open_image':
                    layList.openImage(data.avatar_url);
                    break;
            }
        })

                //自定义方法
        var action = {
            set_value: function (field, id, value) {
                layList.basePost('set_value', { field: field, id: id, value: value }, function (res) {
                    layList.msg(res.msg);
                });
            },

            del: function (id, obj) {
                layer.confirm('确认删除么？', { icon: 3, title: '警告' }, function () {
                    layList.basePost('delete', { id, id }, function (res) {
                        if (res.code == 200) {
                            layList.msg(res.msg, function () {
                                layer.closeAll();
                                 if(typeof(id) == 'number'){
                                    $(obj.tr.selector).remove();
                                }else{
                                    layList.reload();
                                } 
                            })
                        }

                    });
                })
            }
        }



    function dropdown(that) {
        var oEvent = arguments.callee.caller.arguments[0] || event;
        oEvent.stopPropagation();
        var offset = $(that).offset();
        var top = offset.top - $(window).scrollTop();
        var index = $(that).parents('tr').data('index');
        $('.layui-nav-child').each(function (key) {
            if (key != index) {
                $(this).hide();
            }
        })
        if ($(document).height() < top + $(that).next('ul').height()) {
            $(that).next('ul').css({
                'padding': 10,
                'top': - ($(that).parent('td').height() / 2 + $(that).height() + $(that).next('ul').height() / 2),
                'min-width': 'inherit',
                'position': 'absolute'
            }).toggle();
        } else {
            $(that).next('ul').css({
                'padding': 10,
                'top': $(that).parent('td').height() / 2 + $(that).height(),
                'min-width': 'inherit',
                'position': 'absolute'
            }).toggle();
        }
    }
 </script>
{/block}